<template>
  <div class="community-cards">
    <span v-for="(card, idx) in cards" :key="idx">{{ card }}</span>
  </div>
</template>
<script lang="ts" setup>
defineProps<{ cards: string[] }>()
</script>
<style scoped>
.community-cards {
  margin: 16px 0;
  text-align: center;
}
.community-cards span {
  display: inline-block;
  margin: 0 4px;
  background: #fff;
  color: #222;
  border-radius: 3px;
  padding: 2px 8px;
  font-weight: bold;
}
</style> 